{% extends 'layout.html' %}
{% load static %}
{% load permission %}
{% block css %}
    <style>
        .top-message-error {
            position: fixed;
            left: 0;
            right: 0;
            width: 400px;
            margin-left: auto;
            margin-right: auto;
            top: 0;
        }
    </style>
{% endblock %}
{% block content %}
    <div class="top-message-error">
        {% for obj in messages %}
            <div class="alert alert-{{ obj.level_tag }}">{{ obj.message }}</div>
        {% endfor %}
    </div>
    <div style="margin-bottom: 5px">
        <a href="{% url 'my_order_list_add' %}" class="btn btn-success"><span
                class="glyphicon glyphicon-plus-sign"></span>
            新建</a>
    </div>
    <table class="table table-bordered">
        <thead>
        <tr>
            <th>订单号</th>
            <th>视频地址</th>
            <th>数量</th>
            <th>价格</th>
            <th>原播放</th>
            <th>创建时间</th>
            <th>状态</th>
            <th>操作</th>
        </tr>
        </thead>
        <tbody>
        {% for row in pager.queryset %}
            <tr>
                <td>{{ row.oid }}</td>
                <td>{{ row.url }}</td>
                <td>{{ row.count }}</td>
                <td>{{ row.real_price }} ({{ row.price }})</td>
                <td>{{ row.old_view_count }}</td>
                <td>{{ row.create_datetime }}</td>
                <td>{{ row.get_status_display }}</td>
                <td>
                    {% if row.status == 1 %}
                        <a href="{% url 'my_order_list_cancel' pk=row.id %}" class="btn btn-danger btn-xs">撤单</a>
                    {% endif %}
                </td>
            </tr>
        {% endfor %}
        </tbody>
    </table>
    {% include 'include/delete_modal.html' %}
    <ul class="pagination">
        {{ pager.html }}
    </ul>

{% endblock %}

{% block js %}

    <script>
       $(function () {
           setTimeout(function (){
               $(".top-message-error").addClass('hide');
           },5000)
       })
    </script>

{% endblock %}
